/*
初始化阶段
UNSAFE_componentWillMount:render之前最后一次修改状态的机会
render:只能访问this.props和this.state,不允许修改状态和DOM输出
componentDidMount:成功render并渲染完成真实DOM之后触发,可以修改DOM

运行中阶段
UNSAFE_componentWillReceiveProps:父组件修改属性触发
shouldComponentUpdate:返回false会阻止render调用
UNSAFE_componentWillUpdate:不能修改属性和状态
render:只能访问this.props和this.state,不允许修改状态和DOM输出
componentDidUpdate:可以修改DOM

销毁阶段
componentWillUnmount:在删除组件之前进行清理操作,比如计算器和事件监听


新生命周期
getDerivedStateFromProps替代UNSAFE_componentWillReceiveProps
getDerivedStateFromProps:第一次的初始化组件以及后续的更新过程中(包括自身状态更新以及父传子)
返回一个对象作为新的state,返回null则说明不需要在这里更新state

getSnapshot Before Update取代了componet Wil update,触发时间为update发生的时候，在render之后
dom渣染之前返回一个值，作为component Did Update的第三个参数。
*/

import React, {Component} from 'react';
import axios from "axios";

class App extends Component {
    state={
        name:'哈哈哈',
    }
    UNSAFE_componentWillMount() {//16.2前使用,后面被废除
        //前面+UNSAFE_
        //render之前最后一次修改状态的机会
        console.log('一Will Mount',this.state.name)
        this.setState({
            name:'你你你'
        })
        //初始化数据的作用
    }


    componentDidMount() {
        console.log('一Did Mount')
        //数据请求axios
        //订阅函数调用
        //定时器
        //基于创建完的dom进行初始化..........betterscroll


        axios.get(`test.json`).then(res => {
            console.log(res.data.data.films)
            this.setState({
                list: res.data.data.films
            })
        })
    }

    // componentWillReceiveProps(nextProps, nextContext) {
    //
    // }
    //
    // shouldComponentUpdate(nextProps, nextState, nextContext) {
    //
    // }
    //
    // componentWillUpdate(nextProps, nextState, nextContext) {
    //
    // }
    //
    // componentDidUpdate(prevProps, prevState, snapshot) {
    //
    // }
    //
    // componentWillUnmount() {
    //
    // }

    render() {
        return (
            <div>
                <div>{this.state.name}</div>
            </div>
        );
    }
}

export default App;
